<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link href="../../libs/mui.min.css" rel="stylesheet"/>
    <link href="../../css/main.css" rel="stylesheet"/>
    <link rel="stylesheet" href="../../css/mine-order.css"/>
</head>

<body>
<div class="head">
    <img id="back" src="../../images/all-left.png" alt="">
    <p>我的订单</p>
</div>

<div class="title">
    <div class="active"><span>待付款</span></div>
    <div><span>已完成订单</span></div>
</div>

<div class="content">
    <div class="content-l" class="tab-active">
        <p class="content-num"><span>1</span>个订单</p>
        <!--<div class="content-fi">//订单
            <p class="content-fi-ti">
                <span>下单时间：</span>
                <span>代付款</span>
            </p>
            <ul class="mui-table-view">
                li//产品
            </ul>
        </div>-->
    </div>

    <div class="content-r" style="display: none;">
        <p class="content-num"><span>1</span>个订单</p>
        <!--<div class="content-fi">
            <p class="content-fi-ti">
                <span>名校贷 学生贷</span>
                <span>已付款</span>
            </p>
            <img class="order-detal" src="../../images/mine-order.jpg" alt="" width="92%" />
        </div>-->
    </div>
</div>

<script src="../../js/jquery-3.1.1.min.js"></script>
<script src="../../libs/mui.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../../js/url.js"></script>
<script type="text/javascript">
    $('#back').on('tap', function () {
        mui.back()
    })
    $('.title>div').on('tap', function () {
        $(this).addClass('active').siblings().removeClass('active');
        $('.content').children().hide(0);
        $('.content').children().eq($(this).index()).show(0);
        pass();
    })

    pass();

    function pass() {
        var state = $('.title').children().index($(".active")) + 1; // todo
        var stateValue = ['待付款', '已付款'];
        $.ajax({
            type: 'get',
            url: ur + 'rest/productController/orders?state=' + state,
            headers: {
                "X-Token": localStorage.token
                //						"X-Token": '7A61A2857A1347B6B763D29BE82238D4'
            },
            success: function (data) {
                var data = JSON.parse(data)
                if (data.meta.code == "S002") {
                    var indent = data.data.list;
                    var listL = $(".content").children().eq(state - 1).find('.content-fi').length;
                    $(".content-num span").text(indent.length);
                    if (indent.length > 0 && indent.length != listL) {
                        //订单循环
                        for (var i = 0; i < indent.length; i++) {
                            var odiv = '<div class="content-fi" ids="' +
                                indent[i].id + '"><p class="content-fi-ti"><span>下单时间：' +
                                indent[i].createDate + '</span><span>' +
                                stateValue[state - 1] + '</span></p><ul class="mui-table-view"></ul></div>';
                            $(".content").children().eq(state - 1).append(odiv);

                            //订单里的产品循环
                            for (var p = 0; p < indent[i].products.length; p++) {
                                var oItem = '<li class="mui-table-view-cell"><div class="img-box"><img class="order-detal" src="' +
                                    (ur + indent[i].products[p].productImg) + '" alt=""/></div><p>' +
                                    indent[i].products[p].productName + '</p><div class="indent-price"><p>价格：<span class="price-num">' +
                                    indent[i].products[p].price + '</span></p><p>会员价：￥' +
                                    indent[i].products[p].vipPrice + '</p><p>x' +
                                    indent[i].products[p].size + '</p></div></li>';
                                $(".content").children().eq(state - 1).children().eq(i + 1).find('ul').append(oItem);
                            }
                        }
                    }
                } else {
                    mui.toast(data.meta.message);
                }
            }
        })
    }
    //点击待付款产品跳转支付页
    $('.content-l').on('tap', '.content-fi', function () {
        var liArr = $(this).find('.price-num')
        var sumPrice = 0;
        for (var i = 0; i < liArr.length; i++) {
            sumPrice = sumPrice + parseInt(liArr[i].innerHTML);
        }
        localStorage.surehow = liArr.length;
        localStorage.sureallprice = sumPrice;
        localStorage.carid = $(this).attr('ids');
        localStorage.setItem('mine-order-href-sure', '../helper/sure.html')
        href(localStorage.getItem('mine-order-href-sure'), 'sure')
    });
    //添加AddNew自定义事件监听
    window.addEventListener('refresh', function () {
        pass();
    });
</script>
</body>

</html>